<template>
  <q-page>
    <div class="container">
      <div class="row q-col-gutter-md">
        <div class="col-12 text-h4 text-center">Saltybe 房地产信息收集与分析</div>
        <div class="col-12 text-h6 text-center">房产列表</div>
        <div class="col-12">
          <card-list :list="navHouseList" item-max-width="200px" />
        </div>
        <div class="col-12 text-h6 text-center">数据分析</div>
        <div class="col-12">
          <card-list :list="navStatisticList" item-max-width="200px" />
        </div>
      </div>
    </div>
  </q-page>
</template>

<script lang="ts">
import { defineComponent } from '@vue/composition-api';
import CardList from 'components/CardList.vue';

export default defineComponent({
  name: 'PageIndex',
  components: { CardList },
  setup() {
    const navHouseList = [
      { name: '新房', icon: 'mdi-home-outline', link: '/list/new-house' },
      { name: '二手房', icon: 'mdi-home-modern', link: '/list/second-hand-house' },
      { name: '租房', icon: 'mdi-home', link: '/list/renting-house' }
    ];
    const navStatisticList = [
      { name: '全国新房均价分析', icon: 'mdi-chart-bar', link: '/statistic/new-house-average-price' },
      { name: '全国二手房均价分析', icon: 'mdi-chart-bar', link: '/statistic/second-hand-house-average-price' },
      { name: '全国合租房均价分析', icon: 'mdi-chart-bar', link: '/statistic/share-renting-house-average-price' },
      { name: '全国整租房均价分析', icon: 'mdi-chart-bar', link: '/statistic/whole-renting-house-average-price' },
      { name: '站点独立访问量分析', icon: 'mdi-chart-line', link: '/statistic/user-view' },
      { name: '站点页面访问量分析', icon: 'mdi-chart-line', link: '/statistic/page-view' }
    ];
    return { navHouseList, navStatisticList };
  },
  methods: {
    push(location: string): void {
      this.$router.push(location).catch(() => {
        document.location.href = location;
      });
    }
  }
});
</script>

<style>

</style>
